<template>
	<view class="container">
		<view class="addr">
			<!-- <view class="addr-line b-b">
				<text class="title">身份证类型</text>
				<view class="value">
					<picker @change="bindPickerChange" :value="index" :range="cardArray" range-key="text" class="picker">
						<input placeholder="请选择" disabled="disabled" :value="index == -1 ? '' : cardArray[index].text" class="value"></input>
					</picker>
					<text class="yticon icon-xia"></text>
				</view>
			</view> -->
			<view class="addr-line b-b">
				<text class="title">展示图</text>
				<navigator url="/pages/user/common/uploadpic?type=4" class="value">
					<view class="valueEx">{{shopInfo.first_image == null ? "未上传" : "已上传"}}</view>
					<view class="valueFix">
						<text>{{shopInfo.first_image == null ? "去上传" : "去更改"}}</text>
					</view>
					<text class="yticon icon-you"></text>
				</navigator>
			</view>
			<view class="addr-line b-b">
				<text class="title">店铺门头照</text>
				<navigator url="/pages/user/common/uploadpic?type=1" class="value">
					<view class="valueEx">{{shopInfo.shop_photo_image == null ? "未上传" : "已上传"}}</view>
					<view class="valueFix">
						<text>{{shopInfo.shop_photo_image == null ? "去上传" : "去更改"}}</text>
					</view>
					<text class="yticon icon-you"></text>
				</navigator>
			</view>
			<view class="addr-line b-b">
				<text class="title">营业执照</text>
				<navigator url="/pages/user/common/uploadpic?type=2" class="value">
					<view class="valueEx">{{shopInfo.yingyezhizhao_image == null||shopInfo.yingyezhizhao_image == ''? "未上传" : "已上传"}}</view>
					<view class="valueFix">
						<text>{{shopInfo.yingyezhizhao_image == null ||shopInfo.yingyezhizhao_image == ''? "去上传" : "去更改"}}</text>
						
					</view>
					<text class="yticon icon-you"></text>
				</navigator>
			</view>
			<view class="addr-line b-b">
				<text class="title">手持身份证照</text>
				<navigator url="/pages/user/common/uploadpic?type=3" class="value">
					<view class="valueEx">{{shopInfo.z_card_image == null ||shopInfo.z_card_image == ''? "未上传" : "已上传"}}</view>
					<view class="valueFix">
						<text>{{shopInfo.z_card_image == null ||shopInfo.z_card_image == ''? "去上传" : "去更改"}}</text>
					</view>
					<text class="yticon icon-you"></text>
				</navigator>
			</view>
		</view>
		<button v-if="loading" class="cu-btn round lg bg-gradual-orange margin-lr-bj mix-btn">
			<text class="wlIcon-jiazai wlIconfont-spin margin-right-xs"></text> 提交中...
		</button>
		<button v-else  @click="next" class="cu-btn round lg bg-gradual-orange margin-lr-bj mix-btn"> 提交 </button>
		<!-- <text class="mix-btn">提交</text> -->
	</view>
</template>

<script>
	import {
	    mapState 
	} from 'vuex';  
	export default {
		data() {
			return {
				
				shopInfo:{},
				index:-1,
				pagenum:0,
				type:0,
				loading:false
			};
		},
		onLoad(option){
			this.pagenum = option.pagenum;
			if(option.type != undefined)
				this.type = option.type;
			this.loadData();
		},
		computed: {
			...mapState(['hasLogin','userInfo'])
		},
		methods:{
			async loadData(){
				this.$api.get({
					url: '/wanlshop/Small/shopinfo',
					success: res => {
						console.log(res)
						this.shopInfo = res;
						}
						})
			},
			/*async bindPickerChange(e) {
				if(e.target.value == -1){
					this.index = 0;
				}else{
					this.index = e.target.value;
				}
			},*/
			next(){
				if(this.shopInfo.first_image == null){
					this.$wanlshop.msg("请上传展示图!");
					return;
				}
				
				if(this.shopInfo.shop_photo_image == null){
					this.$wanlshop.msg("请上传店铺门头照!");
					return;
				}
				if(this.shopInfo.yingyezhizhao_image == null){
					this.$wanlshop.msg("请上传营业执照照片!");
					return;
				}
				if(this.shopInfo.z_card_image == null){
					this.$wanlshop.msg("请上传手持身份证照片!");
					return;
				}
				this.loading=true
				this.$api.post({
					url:'/wanlshop/Small/MerchantStep3',
					data: {
						"name":this.shopInfo.name,
						"card_id":this.shopInfo.card_id,
						"license_num":this.shopInfo.license_num
					},
					success: res => {
						if(this.type == 0){
							// let needPay = res.data.needPay;
							uni.showModal({
								title:'提示',
								content:'平台将在两个工作日内审核，我们将以站内消息的形式通知您，请留意!',
								showCancel:false,
								success: () => {
									// console.log('1')
									uni.navigateTo({
										url: '/pages/user/merchant/money'
									})
								}
							})
						}
						else if(this.type == 2){
							uni.showModal({
								title:'提示',
								content:'线下店铺信息修改成功!',
								showCancel:false,
								success:(res)=>{
									if(res.confirm){
										uni.navigateBack({
											delta:+this.pagenum
										})
									}
								}
							})
						}
					}
					})
			}
		}
	}
</script>

<style lang='scss'>
	page{
		background: $page-color-base;
	}
	
	.mix-btn {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 630upx;
		height: 80upx;
		margin: 80upx auto 30upx;
		font-size: $font-lg;
		color: #fff;
		background-color: $base-color;
		border-radius: 10upx;
		box-shadow: 1px 2px 5px rgba(219, 63, 96, 0.4);
		margin-top: 300rpx;
	}
	.addr{
		margin: 20upx 25upx;
		background-color: #ffffff;
		display: flex;
		flex-direction: column;
		
		.addr-line{
			display: flex;
			flex-direction: row;
			position:relative;
			padding: 0 20upx;
			color:#75787d;
			font-size: $font-base;
			.title{
				width: 30%;
				height: 100upx;
				line-height: 100upx;
			}
			.value{
				width: 70%;
				height: 100upx;
				display: flex;
				flex-direction: row;
				font-size: $font-base;
				overflow: hidden;
				.picker{
					width: 90%;
				}
				.valueEx{
					width: 50%;
					height: 100upx;
					line-height: 100upx;
					padding-right: 50upx;
					font-size: $font-base;
					overflow: hidden;
					text-align: center;
				}
				.valueFix{
					width: 50%;
					height: 100upx;
					line-height: 100upx;
					font-size: $font-base;
					text-align: right;
					overflow: hidden;
				}
				&.b-b:after{
					left: 0upx;
				}
			}
			
		}
	}
	
	.icon-xia{
		font-size: $font-lg;
		color: $font-color-light;
		flex: 1;
		text-align: right;
		line-height: 100upx;
	}
	
	.icon-you{
		font-size: $font-lg;
		color: $font-color-light;
		flex: 1;
		text-align: right;
		line-height: 100upx;
	}
</style>
